<template>
	<view class="bank_box">
		<view class="margin-bj">
			<view class="item" v-for="(item, key) in bankList" :key="item.id" @click="checkBank(key)">
				<wanl-bank :bankCode="item.bankCode" :bankName="item.bankName" :cardCode="item.cardCode" />
				<view class="choice text-xl" v-if="choice == 1">
					<text class="wlIcon-xuanze-danxuan" v-if="index == key"></text>
					<text class="wlIcon-xuanze" v-else></text>
				</view>
			</view>
		</view>
		<view v-if="bankList.length == 0">
			<wanl-empty text="没找到任何账户"/>
		</view>
		<view class="bottom_btn" @click="onAdd">
			新增新账户
		</view>
	</view>
</template>
<script>
	import wanlBank from '@/components/wanl-bank.vue'
	import wanlEmpty from '@/components/wanl-empty.vue'
	export default {
		components: {
			wanlBank,
			wanlEmpty
		},
		data() {
			return {
				bankList: [],
				index: null,
				choice: 0
			}
		},
		onLoad(option){
			this.choice = option.choice;
			this.loadData()
		},
		methods: {
			async loadData() {
				this.$request({
					url: 'pay/getPayAccount',
					method: 'POST',
				}).then(res => {
					if(res.statusCode == 200) {
						this.bankList = res.data.data
					}
				})
			},
			async refreshList(data) {
				let that = this
				uni.showLoading({
				    title: '更新中..'
				});
				that.$request({
					url: 'pay/addPayAccount',
					method: 'POST',
					data: data,
				}).then(res => {
					if(res.statusCode == 200) {
						that.loadData();
						uni.hideLoading();
					}
				})
			},
			checkBank(key) {
				if(this.choice == 1){
					this.index = key;
					this.prePage().bankData = this.bankList[key];
					uni.navigateBack({})
				}else{
					//进入银行卡详情 删除/查看
					uni.navigateTo({
						url: "./detail?data=" + JSON.stringify(this.bankList[key])
					})
				}
			},
			onAdd() {
				uni.navigateTo({
					url: 'add-bank'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "@/static/style/colorui.css";
	@import "@/static/style/iconfont.css";
	@import "@/static/style/wanlnvue.css";
	@import "@/static/style/wanlshop.css";
	.bank_box {
		overflow: hidden;

		.bottom_btn {
			width: calc(100% - 50upx);
			font-size: 32rpx;
			height: 86rpx;
			color: white;
			background: #EBBE87;
			position: fixed;
			bottom: 100upx;
			left: 20upx;
			border-radius: 50upx;
			text-align: center;
			line-height: 86upx;
		}
	}
</style>
